<template>
    <div class="hello">
        <x-header >添加锻炼记录</x-header>
        <div style="position: absolute;width: 100%;">

            <group title="编辑">
                <x-input v-model="deviceID" title="设备id(必传)" placeholder="请输入设备id" ></x-input>
                <x-input v-model="time" title="运动消耗时间" :max="12" placeholder="请输入运动消耗时间" ></x-input>
                <x-input v-model="cal" title="卡路里" :max="12" placeholder="请输入卡路里" ></x-input>
                <x-input v-model="dis" title="里程*10" :max="12" placeholder="请输入里程*10" ></x-input>
                <x-input v-model="step" title="步数,次数" :max="12" placeholder="请输入步数" ></x-input>
            </group>

            <div style="position: fixed; top: auto; bottom: 40px; left: 10%;right: 10%">
                <x-button type="primary" @click.native="processButton001">提交</x-button>
            </div>

        </div>
    </div>
</template>

<script>
    import {Group, Cell, Tabbar, TabbarItem, Swiper, SwiperItem} from '_vux@2.9.3@vux'
    import {http} from '@/hos/http'

    export default {
        components: {
            Group,
            Cell,
            Tabbar,
            TabbarItem,
            Swiper,
            SwiperItem
        },
        name: 'ScreenAddSportRecord',
        computed: {
            unionid: {
                get () {
                    return this.$store.state.unionid
                },
                set (value) {
                    this.$store.commit('setUnionid', value)
                }
            }
        },
        data () {
            return {
                deviceID: 'Treadmill_01_000000000000_ESLinker',
                time: '0',
                cal: '0',
                dis: '0',
                step: '0'
            }
        },
        methods: {
            processButton001 () {
                if (this.unionid.indexOf('ow-Ad1') !== 0 || this.unionid.length !== 28) {
                    alert('联合id错误')
                    return
                }
                let data = {
                    unionid: this.unionid,
                    deviceID: this.deviceID,
                    time: Number(this.time),
                    cal: Number(this.cal),
                    dis: Number(this.dis),
                    step: Number(this.step)
                }

                alert(JSON.stringify(data))
                http.get('https://screen.zjlijiujia.com/common/api/addSportRecord.php', data, {})
                .then((resp) => {
                    alert(JSON.stringify(resp))
                }, (error) => {
                    alert(JSON.stringify(error))
                })
            }
        },
        beforeDestroy () {
        }
    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
    h1, h2 {
        font-weight: normal;
    }
    ul {
        list-style-type: none;
        padding: 0;
    }
    li {
        display: inline-block;
        margin: 0 10px;
    }
    a {
        color: #42b983;
    }
</style>
